<template>
	<div class="container" v-title data-title='我的报备'>
		<Header title="我的报备"></Header>
		<div class="fixed-header clearfix" style="top: 3em">
			<div class="header-half bor-r">
				<select v-model="params.customerStatus">
					<option value="">报备状态</option>
					<option v-for="(row,index) in customerArray" v-bind:value="index">{{row}}</option>
				</select>
				<i class="fa fa-angle-down"></i>
			</div>
			<div class="header-half" style="text-align: right">
					<img src="../../assets/images/addIcon.png" @click="addCustomer">
				<div class="searchTextIcon" @click="toSearch()" style="float:left">
					<div class="searchText">{{params.searchContent}}</div>
					<a href="javascript:;">
						<img src="../../assets/images/search.png">
					</a>
				</div>
			</div>
		</div>
		<ul class="report-list-view">
			<li v-for="(row,index) in customerPremisesList">
				<router-link :to="{name:'declareDetail',params:{id:row.id}}" >
				<div class="report-info-cell year-time-list">
					<div class="template-list-right">
						<div class="title">{{row.name}}</div>
						<div class="content">{{row.formatCreateTime}}</div>
					</div>
					<div class="report-list-details">
						<div class="report-phone">{{row.mobile}}</div>
						<div class="report-name">{{row.premisesName}}</div>
						<div class="report-state colA" style="width:100px;">{{row.currentStatus}}</div>
					</div>
					<div class="report-list-details" v-if="row.reward!=0">
						<div class="report-name">带看奖:</div>
						<div class="report-state colA">{{row.reward==0?"":row.reward}}元/次</div>
					</div>
				</div>
				</router-link>
			</li>
		</ul> 
		<!-- 弹出搜索层 -->
		<search-page  v-show="modalShow" v-on:child-tell='listenTo' v-on:search-text='searchTo' msgFrom = "params.searchContent"></search-page>
		<mugen-scroll :handler="list" :should-handle="!loading" >
		</mugen-scroll>
	</div>
</template>
<script>
	import MugenScroll from 'vue-mugen-scroll'
	import SearchPage from './searchBar.vue'
	export default{
		data(){
			return {
				modalShow: false,
				tellWrods:'',
				params:{
					pageSize:10,
					pageNo:0,
					customerStatus:'',
					name:'',
					searchContent:''
				},
				customerPremisesList:[],
				customerArray:[],
				loading:false
			}
		},
		watch:{
			'params.customerStatus':function(newValue,oldValue){
				var _self = this;
				_self.customerPremisesList = [];
				_self.params.pageNo=0;
				_self.params.customerStatus = newValue;
				_self.list();
			},
			'params.searchContent':function(){
				var _self = this;
				_self.customerPremisesList = []
				_self.params.pageNo=0;
				_self.list();
			}
		},
		components: {
			MugenScroll,
			SearchPage
		},
		mounted(){
			this.customerStatuList();
            $("#goble_menu_div").show();
		},
		methods:{
			list:function(){
				var _self = this;
				_self.loading = true;
				_self.params.pageNo = _self.params.pageNo+1;
			//	_self.params.searchContent = _self.params.searchContent;
				var body = {};
				body.params = _self.params;
				var url = _self.utilHelper.apiUrl+'/api/getCPPage';
				_self.$http.post(url,body).then((response)=>{
					var result = response.body.resData.cpDtoPage;
					var cpDtoPage = result.cpDtoPage;
					if(cpDtoPage && _self.params.pageNo>result.totalPages){
						_self.loading = true;
					}else{
						for(var i=0;i<result.rows.length;i++){
							_self.customerPremisesList.push(result.rows[i]);
						}
						_self.loading = false;
					}
				},(response)=>{
					layer.alert("接口异常!");
				});
			},
			customerStatuList:function(){
				var _self = this;
				var url = this.utilHelper.apiUrl+'/common/getEnum/CustomerStatusEnum';
				var body = {};
				body.params = {};
				var findStatusParams = {
					//过滤已带看、已认购、已签约
					flag:'2,3,4'
				};
				_self.$http.get(url,body).then((response) =>{
					_self.customerArray = response.body.data;
				},(response)=>{
					layer.alert("系统异常!");
				});
			},
			listenTo:function(msg){
				this.modalShow= msg;
			},
			searchTo:function(msg){
				this.params.searchContent= msg;
			},
			toSearch:function(){
				this.modalShow = true;
			},
            addCustomer(){
                //若为游客则弹出绑定对话框
                if(this.tourist()){
                    return ;
                }
                this.$router.push({
                    path: '/addCustomer'
                })
            }
		}
	}
	
</script>